<template>
	<view class="listBox" v-if="list">
		<view class="header">
			<!-- 固定头部 -->
			<view class="fixed">
				<view class="fixedBox">
					<view :class="planShow == 1 ? '' : 'plan'" @click="[planShow = 1,getlist(1)]">干预计划</view>
					<view :class="planShow == 2 ? '' : 'record'" @click="[planShow = 2,getlist(2)]">干预记录</view> 
				</view>
			</view>
		</view>
		
		<view class="mainContent" v-if="list.length > 0">
			<!-- 干预计划 -->
			<view class="planBox" v-show="planShow == 2">
				<view class="item" v-for="(item,index) in list" :key="index">
					<view class="top">
						<view class="left">
							<image src="../../../static/img/quickly/intervenscheme/headPortraits.png"></image>
							<view>{{item.userName}}</view>
						</view>
						<view :class="['right',item.status == 1?'on':'']">
							<text>{{item.status == 1?'正常':'逾期'}}</text>
							<view>{{item.modifiedDate}}</view>
						</view>
					</view>
					
					<view class="content">
						<view class="contentItem">
							<view class="data">计划日期：<text>{{item.createdDate}}</text></view>
							<view class="part">主要内容：<text>{{item.content}}</text></view>
						</view>
						<view class="specificItem">
							<view>具体事项：</view>
							<view v-html="item.specificMatters"></view>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 干预记录 -->
			<view class="recordBox" v-show="planShow == 1">
				<view class="nav"  v-for="(item,index) in list" :key="index" @click="toview(item)">
					<view class="left">
						<image src="../../../static/img/headFeature/member/archivedOne.png"></image>
						<view>{{item.healthName}}</view>
					</view>
					<view class="middle">
						<view>干预计划</view>
						<view>方案编号：{{item.sn}}</view>
						<view>签发时间：{{item.modifiedDate}}</view>
					</view>
					<view class="right">已存档</view>
				</view>
			</view>
		</view>
		<view class="noneChating" v-if="list.length <= 0">
			<image src="../../../static/img/headFeature/chattingNone.png"></image>
			<view>暂无数据</view>
		</view>
	</view>
</template>

<script>
	import {getUrlParam} from '@/static/js/filter.js'
	export default {
		data () {
			return {
				planShow: 1,
				pageIndex:1,
				pageSize:20,
				list:null,
				userId: ''
			}
		},
		mounted(){
			this.userId = getUrlParam('userId');
			this.getlist(1);		
		},
		methods:{
			getlist(e){
				const _this = this;
				e == 2?
					_this.$api.userPlanRecordList({pageIndex:_this.pageIndex,pageSize:_this.pageSize,userId:_this.userId}).then((res)=>{
						_this.list = res.data.result.elements || []
					})
				:
					_this.$api.userPlanList({pageIndex:_this.pageIndex,pageSize:_this.pageSize,userId:_this.userId}).then((res)=>{
						_this.list = res.data.result.elements || []
					})
			},
			toview(item){
				uni.navigateTo({
					url:'/pages/headFeatures/userInterventionPlan/toView?id='+item.id+'&userId='+this.userId
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/static/css/headFeatures/userInterventionPlan/list.scss';
	.noneChating {
		padding-top: 228upx;
		image {
			display: block;
			margin: 0 auto;
			width: 260upx;
			height: 154upx;
		}
		view {
			margin: 24px auto;
			text-align: center;
			color: #333333;
			font-size: 13px;
		}
	}
</style>
